var vm = new Vue({
    el:"#app",
    data:{
        taskName:"",
        // 定义一个数组保存新增加的任务
        tasklist:[
             //保存新增的任务
        ]
    },
    methods:{
        addTask(){
            // 构建一个新的任务对象，flag属性表示任务的状态 true 已完成；false 未完成
            var obj={
                id:this.tasklist.length+1 ,
                name:this.taskName,
                flag:false
            };
            this.tasklist.push(obj);
            this.taskName="";  //清空输入框
            
        },
        changeStatus(item){
            item.flag =  !item.flag;
        },
        sub(index){
            // console.log(index)
            this.tasklist.splice(index,1)
            // console.log(this.tasklist)
          
            // 找还有几条数据
            for(let i = 0;i<this.tasklist.length;i++){
                // 遍历json对象 找到 id  
                for(let a in this.tasklist){
                    if(a == "id"){
                        // 将id 赋值为遍历的值加1
                        this.tasklist[i][a] = i +1;
                    }
                    // 将不是id中的其他json中的数据也遍历进去
                    a = this.tasklist[i][a]
                }
            }



            // console.log(this.tasklist)
          
        }
    },
    computed: {
        // 直接当做普通属性调用不加括号
        // 任何data中数据变化立即重新计算
        // 计算属性会缓存
        unFinishCount(){
          
            var arr = this.tasklist.filter((item)=>{
                return item.flag == false;
            
            })
            return arr.length;
        }
        
    },
})